<template lang="html">
	<div class="cart-tj">
	  	<div class="title">
		  	<div></div>
		  	<div>热门推荐</div>
		  	<div></div>
		</div>
		<ul class="tjList">
	 		<li v-for="i in 2">
	 			<div class="img"><img :src="data[0].firstlist[i].secondlist[0].src" alt=""></div>
	 			<i class="like yo-ico" v-show="!likeShow" @click="changeShow">&#xe60e;</i>
	 			<i class="like yo-ico" v-show="likeShow" @click="changeShow">&#xe60c;</i>
	 			<div class="word">
	 				<div class="word-left">
	 					<p>{{data[0].firstlist[i].secondlist[0].sname}}</p>
	 					<p><i class="yo-ico">&#xe635;</i>{{data[0].firstlist[i].secondlist[0].nprice}}</p>
	 					<del>原价<span>{{data[0].firstlist[i].secondlist[0].oprice}}</span></del>
	 				</div>
	 				<div class="word-right">
	 					<i v-bind:class="[{pink:isCart},'yo-ico']"  @click='addcart( data[0].firstlist[i].secondlist[0])'>&#xe60f;</i>
	 				</div>
	 			</div>
	 		</li>
	 	</ul>
 	</div>
 	
</template>

<script>

import Vue from 'vue'
import axios from 'axios'

export default {
  data() {
    return {
      likeShow:false,
      isCart : false,
      data:[],
    }
  },
  methods: {
   changeShow(){
   	 this.likeShow = ! this.likeShow;
   },
   cart(){
   	  this.isCart = !this.isCart;
   },
    addcart(n){
	    this.$store.commit({
	    	type:'addcart',
	    	amount:n
	    })
	}

  },
  mounted() {
  		axios.get('/vip/list.php')
	      .then((res)=>{       
	        this.data=res.data;
	      })
    },
   updated() {
   	
    },
}
</script>

